<template>
  <div id="mqttws">
    <!-- <input type="text" id="msg" v-model="msg"/>
    <input type="button" value="Send" @click="send" />
    <input type="button" value="Start" @click="start"/>
    <input type="button" value="Stop" @click="stop"/> -->
  </div>
</template>
<script>
  export default {
    name: 'mqttws',
    data() {
      return {
        hostname: '192.168.0.240',
        port: 8083,
        clientId: 'clientId-NX75qTbKES',
        timeout: 5,
        keepAlive: 50,
        cleanSession: false,
        ssl: false,
        userName: 'hj',
        password: '123456',
        topic: '001/in',
        client:{},
        options: {},
        msg:'order',
        count:0
      }
    },
    created : function() {
      this.client = new Paho.MQTT.Client('192.168.0.240', 8083, 'clientId-NX75qTbKES');
      var _client = this.client;
      var opt = this.options =
        {
          invocationContext: {
            host: '192.168.0.240',
            port: 8083,
            path: _client.path,
            clientId: 'clientId-NX75qTbKES'
          },
          timeout: 5,
          keepAliveInterval: 50,
          cleanSession: false,
          useSSL: false,
          userName: 'hj',
          password: '123456',
          onSuccess: function() {
            console.log("MQTT 已连接 || onConnected");
          },
          onFailure: function (e) {
          console.log(e);
          }
        };
      this.client.connect(opt); //连接服务器并注册连接成功处理事件
      this.client.onConnectionLost = this.onConnectionLost; //注册连接断开处理事件
      this.client.onMessageArrived = this.onMessageArrived; //注册消息接收处理事件
      // 消息push推送事件监听
      let _this = this;
      document.addEventListener("plusready",function(){
        _this.plusReady();
      },false);
    },
    methods: {
      onConnectionLost: function (responseObject) {
        if (responseObject.errorCode !== 0) {
          console.log("onConnectionLost:" + responseObject.errorMessage)
          console.log("连接已断开")
        }
      },
      onMessageArrived: function (message) {
        console.log("收到消息:" + message.payloadString);
        // 推送消息
        if(window.plus) {this.createLocalPushMsg(message.payloadString)};
      },
      // onConnect : function() {
      //   console.log("onConnected");
      // },
      plusReady () {
        console.log( "用户唯一标识uuid: " + plus.device.uuid  );
        var info = plus.push.getClientInfo();
        console.log( "推送消息用户信息: " + JSON.stringify( info ) );
        // 添加监听从系统消息中心点击消息启动事件
        plus.push.addEventListener( "click", function ( msg ) {
            // 分析msg.payload处理业务逻辑 
            alert( "你点击了消息： " + msg.content ); 
        }, false ); 
      },
      createLocalPushMsg (message) {
          var options = {cover:false};
          plus.push.createMessage( message, "LocalMSG", options );
          if(plus.os.name=="iOS"){
              // alert('*如果无法创建消息，请到"设置"->"通知"中配置应用在通知中心显示!');
          }
      }
      // ,send : function (){
      //   var s = this.msg;
      //   if(s){
      //     // console.log(new Date().Format("yyyy-MM-dd hh:mm:ss"));
      //     s = "{time:"+0+", content:"+(s)+", from: web console}";
      //     var message = new Paho.MQTT.Message(s);
      //     message.destinationName = this.topic;
      //     this.client.send(message);
      //     this.msg = '';
      //   }
      // },
      // start : function(){
      //   window.tester = window.setInterval(function(){
      //     if(this.client.isConnected){
      //       var s = "{time:"+0+", content:"+(this.count++)+", from: web console}";
      //       var message = new Paho.MQTT.Message(s);
      //       message.destinationName = this.topic;
      //       this.client.send(message);
      //     }
      //   }.bind(this), 1000);
      // },
      // stop : function (){
      //   window.clearInterval(window.tester);
      // }
    }
  }
</script>
<style>
#mqttws{
    position: absolute;
    z-index: 999;
}
</style>
